<script setup>
import { getMessagesPageAPI } from '@/api/message'
import { ref } from 'vue';

//公告列表数据
const announceList=ref([])

const announceData = {
  contentType: 200,
  page: 1,
  pageSize: 5
}
//总页数
const totalPage = ref(1)
//已读未读
const icUnread = ref(true)
// 是否加载完成
const isTriggered = ref(false)

//获取分页查询消息列表
const getAnnounceList = async () => {
  const { data } = await getMessagesPageAPI(announceData)
  // console.log(data);
  announceList.value = data.items
  totalPage.value = data.pages
}
getAnnounceList()

//上拉刷新
const onScrollToLower = async () => {
  if (announceData.page >= totalPage.value) {
    return
  }
  announceData.page++
  const { data } = await getMessagesPageAPI(announceData)
  announceList.value = [...announceList.value, ...data.items]
}

//下拉刷新
const onScrollViewRefresh = async () => {
  // console.log('下拉刷新');
  isTriggered.value = true
  announceList.page = 1
  announceList.value = []
  await getAnnounceList()
  isTriggered.value = false
}

</script>
<template>
  <scroll-view class="scroll-view" refresher-enabled scroll-y :refresher-triggered="isTriggered"
    @refresherrefresh="onScrollViewRefresh" @scrolltolower="onScrollToLower">
    <view class="scroll-view-wrapper">
      <view class="message-action" @click="icUnread=false">
        <text class="iconfont icon-clear"></text>
        全部已读
      </view>
      <uni-list :border="false">
        <uni-list-item v-for="item in announceList" :to="`/subpkg_message/content/index?id=${item.id}`" ellipsis="1" :title="item.title"
          :rightText="item.created">
          <template v-slot:header>
            <text :class="{dot:icUnread}"></text>
          </template>
        </uni-list-item>
      </uni-list>
    </view>
  </scroll-view>
</template>

<style lang="scss" scoped>
@import './styles.scss';
</style>
